<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>login</title>
    <link rel="stylesheet" href="../../style/login/login.css">
    <link rel="short cut" href="../../favicon.ico"/>
    <!-- <link href="css/login.css" rel="stylesheet"> -->
    <script type="text/javascript" src="../../plugins/jQuery/jquery-3.6.0.js"
            ￼
    ></script>
    <script type="text/javascript" src="../../plugins/vue/vue.js"
            ￼
    ></script>
    <script type="text/javascript" src="../../plugins/axios/axios.js"
            ￼
    ></script>
    <script type="text/javascript" src="../../plugins/layer-master/dist/layer.js"
            ￼
    ></script>
</head>

<body>
<div id="app">
    <form id="form" method="post">
        <h1 id="loginMsg">登 陆</h1>
        <label style="color: red">{{error}}</label>
        <p><label for="cus_name">Username:</label>
            <input id="cus_name" name="cus_name" type="text" v-model="cus_name"
                   autocomplete="off">
        </p>

        <p><label for="cus_password">Password:</label>
            <input id="cus_password" name="cus_password"
                   type="password" v-model="cus_password"></p>
        <div id="subDiv">
            <input type="button" class="loginButton" value="登陆" @click="login">
            <input type="reset" class="button" value="重置">&nbsp;&nbsp;&nbsp;
        </div>
    </form>
</div>


</body>
</html>
<script type="text/javascript">
    new Vue({
        el: '#app',
        data: {
            cus_name: '',
            cus_password: '',
            error: ''
        },
        methods: {
            login() {
                alert(this.cus_name+".."+this.cus_password)
                axios({
                    url: 'http://localhost:8888/customer/find',
                    method: 'get',
                    params: {
                        cus_name: this.cus_name,
                        cus_password: this.cus_password
                    }
                }).then(resp => {
                    let result = resp.data
                    console.log(result)
                    if (result.success) {
                        // 登陆成功
                        // 保存用户信息
                        localStorage.setItem('id', result.data)
                        // 跳转到首页
                        location.href = '../../index.html'
                        return;
                    }
                    // 登陆失败
                    this.error = result.error
                })
            }
        }
    })
</script>